<html>
	<head>
		<link href="index.css" rel="stylesheet" type="text/css">
		
		<script type="text/javascript" src="mootools.js"></script>
		<script type="text/javascript" src="request.js"></script>
		<script type="text/javascript" src="md5.js"></script>
	</head>
	<body>
		<h2>Login</h2>
		
		<div style="float:left">
			<div id="tf_email" style="height:50px;width:250px"></div>
		</div>
		<div style="clear:both;margin;top:10px"></div>
		
		<div style="float:left">
			<div id="tf_password" style="height:50px;width:250px"></div>
		</div>
		<div style="clear:both;margin;top:10px"></div>
		<div id="status" style="width:250px; text-align:center;">Please enter your email address and password.</div>
		<br>
		<div id="buttonbar"></div>
		<div style="clear:both;margin;top:10px"></div>

		
		<script>
			var u_login = '';
			var u_password = '';
			
			var myDB = Titanium.Database.open('Joel');
			var lastsession = myDB.execute('select * from `session`');
			if(lastsession.rowCount>0) {
				lastuser = myDB.execute('select * from `user` where user_id = ?'. lastsession.fieldByName('user_id'));
						
				if(lastuser.rowCount>0) {
					u_login = lastuser.fieldByName('user_login');
					u_password = lastuser.fieldByName('user_password');
				}
			}
			
			var setstatus = function(str) {
				$('status').innerHTML = str;
			};
			
			var height = (Titanium.Platform.name.indexOf('iPhone') != -1) ? 30: 40;


			// CREATE AND SETUP INFPUT FIELDS FOR LOGIN
			var tf_email = Titanium.UI.createTextField({
				id:'tf_email',
				value:u_login,
				keyboardType:Titanium.UI.KEYBOARD_EMAIL_ADDRESS,
				hintText:'email',
				width:250,
				height:height,
				clearOnEdit:false,
				borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
				clearButtonMode:Titanium.UI.INPUT_BUTTONMODE_ALWAYS,
			});
			tf_email.addEventListener('blur',function(e) {
				u_login = e.value;
			});
			
			var tf_password = Titanium.UI.createTextField({
				id:'tf_password',
				value:u_password,
				keyboardType:Titanium.UI.KEYBOARD_EMAIL_ADDRESS,
				hintText:'password',
				width:250,
				height:height,
				clearOnEdit:false,
				passwordMask:true,
				borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
				clearButtonMode:Titanium.UI.INPUT_BUTTONMODE_ALWAYS,
			});
			tf_password.addEventListener('blur',function(e) {
				u_password = e.value;
			});

			// create a button bar in the content area for element id = 'buttonbar'
			var buttonBar = Titanium.UI.createButtonBar({id:'buttonbar', 
				height:40,
				width:250,
			    labels:['Login'],
				backgroundColor:'#336699'});
			
			
			
			
			var loginAction = function(e) {
			   // use e.index to get the index of the button that was clicked
				if(u_login != '' || u_password != '') {
					
					setstatus('logging in');
					
					request('login', {
						u_login:u_login,
						u_password:hex_md5(u_password+"Das weiss ich nicht")
						
					}, function(res) {
						if(res.result === 'failure') {
							setstatus(res.reason);
							
						} else {
							Titanium.App.Properties.setString('username', u_login);
							Titanium.App.Properties.setString('password', u_password);
							Titanium.App.Properties.setBool('autologin', false);

							var dbuser = myDB.execute('select * from `user` where `user_id` = ?', res.userdata.user_id);
							if(dbuser.rowCount>0) {
								var dbuser = myDB.execute('update `user` set user_name = ?, user_email = ? where `user_id` = ?',
									res.userdata.u_name,
									res.userdata.u_email,
									res.userdata.user_id);
								
							} else {
								
								myDB.execute('insert into user (user_id, user_login, user_password, user_name, user_email) values (?,?,?,?,?)', 
									res.userdata.user_id,
									u_login,
									u_password,
									res.userdata.u_name,
									res.userdata.u_email);
							}
							
							
							var viewCollections = Titanium.UI.createWebView({url:'collections.html', name:'viewCollections'});
							Titanium.UI.currentWindow.addView(viewCollections);
							Titanium.UI.currentWindow.showView(viewCollections,{
								animated:true,
								animationStyle:Titanium.UI.iPhone.AnimationStyle.FLIP_FROM_LEFT,
								animationDuration:500
							});	
						}
					});
					
				} else {
					status('Please enter your email and password');
				}
			}
			
			
			// add a click listener for the button bar
			buttonBar.addEventListener('click', loginAction);
			
		</script>
	</body>
</html>